import React from 'react';

import './styles/normal_word.less';

interface NormalWordProps {
	normalWord?: any[];
	onClick?: (value?: string) => void;
}

const NormalWord = (props: NormalWordProps) => {
	const {
		normalWord = [
			{ value: '您好，请问有什么可以帮您～' },
			{ value: '请问，您是想咨询哪些方向的业务？' },
			{ value: '由于查询需要一些时间，不好意思要耽误您一点时间。' },
			{ value: '我很愿意聆听您的意见，请您慢慢讲，我一定会尽力帮助您的。' },
			{ value: '非常抱歉，给您造成不便，请您放心，一定会给您一个满意的处理结果。' },
			{ value: '感谢您的批评指正，我们会及时改正，不断提高服务水平。' },
			{ value: '当前将为您转接其他坐席，请耐心等待....' },
			{ value: '本次服务到此结束，祝您生活愉快，再见～' }
		],
		onClick
	} = props;
	return (
		<div className="normal-word-container">
			<div className="header">
				<p className="title-text">发送常用语句</p>
			</div>
			<div className="content">
				{normalWord.map((item, index) => {
					return (
						<p key={index} onClick={() => onClick!(item.value)}>
							{item.value}
						</p>
					);
				})}
			</div>
		</div>
	);
};

export default NormalWord;
